<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Mybatis Plus代码生成器</title>
  <link rel="stylesheet" type="text/css" href="js/antd/antd.css"/>
  <script src="js/vuejs/vue.min.js"></script>
  <script src="js/antd/antd.min.js"></script>
  <script src="js/vuejs/axios.min.js"></script>
  <script src="js/common.js"></script>
</head>
<style>
  #components-layout-fixed .logo {
    float: left;
  }
  .ant-layout-header{
    background: #ffffff !important;
  }
  .ant-layout-sider{
    background-color: #f0f2f5 !important;
    border-right: 1px solid #e7e0e0;
  }
  body{
    background-color: #f0f2f5;
  }
  .menu{
    height: 45px;
    text-align: left;
  }
  .menu a{
    font-size: 14px;
    padding: 8px 5px;
    color: rgba(0, 0, 0, 0.65);
  }
  .menu.active a{
    font-weight: bolder;
    color: #1890ff;
  }
  .menu a:hover{
    color: #1890ff;
  }
  .ant-layout-footer{
    padding: 0px 50px 20px 50px;
  }
</style>
<body>
<div id="mainDiv">
  <a-layout class="layout" id="components-layout-fixed">
    <a-layout-header  :style="{ position: 'fixed', zIndex: 1, width: '100%' }">
      <div class="logo">
        <img src="img/logo.png" style="width: 100px; border-radius: 5px;"> Mybatis Plus代码生成器
      </div>
      <img src="img/img1.png" style="width: 45px; margin-top: 10px;border-radius: 5px;float: right">
      <div style="float: right" v-text="welcome"></div>
    </a-layout-header>
    <a-layout-content style="padding: 0 25px;min-height: 550px;margin-top: 64px">
      <a-layout style="padding: 24px 0;">
        <a-layout-sider width="120">
          <div class="menu" :class="currMenu.id == m.id ? 'active': ''" v-for="m in menus" @click="toURL(m)">
            <a><a-icon style="fontSize: 16px" :type="m.icon"></a-icon>  {{m.title}}</a>
          </div>
        </a-layout-sider>
        <a-layout-content style="padding: 0px 20px">
          <iframe border="0" style="border: 0; width: 100%;min-height: 770px;" :src="currMenu.url"></iframe>
        </a-layout-content>
      </a-layout>
    </a-layout-content>
    <a-layout-footer style="text-align: center">
      Mybatis Plus代码生成器 ©2023 Created by Lei Yuan
    </a-layout-footer>
  </a-layout>
</div>
</body>
</html>
<script>
  (function () {
    const menus = [
      {id: 1, icon: "file-zip", title: "代码生成", url: "html/tables.html"},
      {id: 2, icon: "database", title: "数据库管理", url: "html/conns.html"},
    ]
    new Vue({
      el: "#mainDiv",
      data: {
        nickName: localStorage.nickName,
        menus: menus,
        currMenu: menus[0],
        welcome: ""
      },
      methods: {
        toURL: function (m) {
          this.currMenu = m
        },
        menuClick: function (o) {
          if(o.key == "logout"){
            getReq("/logout", {}).then(res => {
              location.href = "/";
            })
          }
        },
        createWelcome: function () {
          let now = new Date(), hour = now.getHours()
          let welcome = "";
          if (hour < 6) {
            welcome = "凌晨还在加班！在修仙吗？"
          } else if (hour < 9) {
            welcome = "早安！"
          } else if (hour < 12) {
            welcome = "上午好！"
          } else if (hour < 14) {
            welcome = "中午好！"
          } else if (hour < 17) {
            welcome = "下午好！"
          } else if (hour < 19) {
            welcome = "傍晚好！"
          } else if (hour < 22) {
            welcome = "晚上好！"
          } else {
            welcome = "亲，该休息了！"
          }
          this.welcome = welcome;// hour + " : " + now.getMinutes()
        }
      },
      created(){
        this.createWelcome()
      }
    })
  })();

</script>
